Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI bug: Unintended movement when zooming in or out #144

Closed
wants to merge 1 commit into from

Conversation

ugtthis
Copy link
Contributor

@ugtthis ugtthis commented Jan 30, 2025

Current UI Proposed UI
Current UI Proposed UI
  • The vertical scrollbar is shifting because the content width calculation doesn't account for the scrollbar width when using VW(w-screen)
  • UI movement happens when the drawer is open and closed, and when viewing a route
  • Safari is the browser that only shows movement when the drawer is open


Testing bug on different browsers

Firefox

firefox


Google Chrome

chrome


Safari - only shows the movement when drawer is open

safari

Copy link

deployed preview: https://144.connect-d5y.pages.dev

Welcome to new-connect! Make sure to:

  • read the contributing guidelines
  • mark your PR as a draft until it's ready to review
  • post the preview on Discord; feedback from users will speedup the PR review

Mobile

Desktop

@ugtthis ugtthis marked this pull request as draft January 30, 2025 22:18
@ugtthis
Copy link
Contributor Author

ugtthis commented Jan 31, 2025

Noticed that with this current change, Safari is still having the same resize motions when sidebar is open. I think it has to do with the transition-drawer and how Safari treats it differently than the other browsers.

I'm currently working on updating the always-on-sidebar PR in which this unintended motion would not exist. So currently this PR does fix Chrome and Firefox but Safari experience stays the same.

@ugtthis ugtthis marked this pull request as ready for review January 31, 2025 04:53
@ugtthis
Copy link
Contributor Author

ugtthis commented Feb 2, 2025

This PR can be closed if #146 gets merged since in that PR it uses 100% width versus 100VW for the <main> in Drawer.tsx

@ugtthis
Copy link
Contributor Author

ugtthis commented Feb 3, 2025

Closing this PR because of #161

@ugtthis ugtthis closed this Feb 3, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants